<template>
	<page>
    <view class="login-content">
      <view class="head-info"></view>
      <view class="login-bg">
        <image src="https://picsum.photos/300/600?id=43"></image>
      </view>
      <view class="login-data">
        <view class="logo-info">
          <view class="logo">
<!--            <image src="/static/logo.png"></image>-->
            <text>你好，</text>
            <text>很高兴认识你</text>
          </view>
        </view>
        <view class="login-info" style="display: none">
          <view class="login-input">
            <view class="input-text">
              <view class="icon">
                <image src="/static/images/icon/sjh_icon.png"></image>
              </view>
              <view class="content">
                <input type="tel" v-model="phone" maxlength="11" placeholder-class="login-pl" placeholder="请输入手机号">
              </view>
            </view>
            <view class="input-text">
              <view class="icon">
                <image src="/static/images/icon/mima_icon.png"></image>
              </view>
              <view class="content">
                <input type="password" v-model="password" maxlength="26" placeholder-class="login-pl" placeholder="请输入密码">
              </view>
            </view>
          </view>
          <view class="login-btn">
            <view class="btn" @click="onLogin">
              <text>登录</text>
            </view>
          </view>
        </view>
        <view class="login-info">
          <view class="login-btn" style="margin-top: 300rpx">
            <view class="btn" @click="onWxLogin">
              <text>微信登录</text>
            </view>
          </view>
        </view>
      </view>
    </view>
	</page>
</template>

<script setup>

import {getCurrentInstance, ref} from "vue";
import {phoneLogin, wxLogin} from "../../api/api";
import chat from "../../common/chat";


const { proxy } = getCurrentInstance();

const phone = ref('');
const password = ref('');

/**
 * 登录点击
 */
function onLogin(){
  if(!phone.value){
    proxy.$way.toast('手机号不能为空')
    return;
  }
  if(!password.value){
    proxy.$way.toast('密码不能为空')
    return;
  }
  phoneLogin({
    phone: phone.value,
    password: password.value,
  }).then(res =>{
    uni.setStorageSync('user_id',res.data.user_id);
    uni.setStorageSync('phone',res.data.phone);
    uni.setStorageSync('userInfo',res.data);
    proxy.$global.user_id = res.data.user_id;
    proxy.$global.phone = res.data.phone;
    proxy.$global.userInfo = res.data;
    chat.connect();
    chat.getUnreadMessage();
    uni.navigateBack();
  })
}

/**
 * 微信登录
 */
function onWxLogin(){
  uni.login({
    provider: 'weixin', //使用微信登录
    success: (loginRes) => {
      console.log(loginRes);
      wxLogin({
        code: loginRes.code,
      }).then(res =>{
        uni.setStorageSync('user_id',res.data.user_id);
        uni.setStorageSync('phone',res.data.phone||'');
        uni.setStorageSync('userInfo',res.data);
        proxy.$global.user_id = res.data.user_id;
        proxy.$global.phone = res.data.phone||'';
        proxy.$global.userInfo = res.data;
        chat.connect();
        chat.getUnreadMessage();
        uni.navigateBack();
      })
    }
  });
}
</script>

<style lang="scss">
  @import "login.scss";
</style>
